import React, { Component } from 'react'
// 持久化数据结构 Persistent Data Structure
// 使用旧数据创建新数据时，要保证旧数据同时可用且不变。 时间穿梭 git
// 结构共享 Structural Sharing
// 为了避免deepCopy把所有节点都复制一遍带来的性能损耗

// vue 响应式
import { Map, List } from 'immutable'
export default class App extends Component {
  render() {
    /*
    let map1 = Map({
      a: 0,
      b: 1
    })
    // console.log(map1)
    // let map2 = map1.set('a', 0)
    // console.log(map2 === map1) // true
    let map2 = map1.set('a', 100)
    console.log(map1.get('a')) // 0
    console.log(map2.get('a')) // 100
    console.log(map2 === map1) // false
    */
   /*
    let map1 = Map({x: 0,y: 1})
    let map2 = Map({x: 0,y: 1})
    // 内存是两份
    console.log(map1 == map2) // false
    console.log(map1 === map2) // false
    console.log(map1.equals(map2)) // true 内容比
    
    const map1 = Map({x: 0,y: 1})
    const map2 = map1.set('x', 0)
    console.log(map1 == map2) // true
    console.log(map1 === map2) // true
    console.log(map1.equals(map2)) // true
 
    const map1 = Map({x: 0,})
    const map1Copy = map1
    map1Copy.set('x', 100)
    console.log(map1Copy.get('x')) // 0 改不了100
    console.log(map1.equals(map1Copy)) // true
 */

    // let x = {
    //   a: 0,
    //   b: 1
    // }

    // let y = {
    //   a: 0,
    //   b: 1
    // }
    // console.log(x == y) // false 
    // console.log(x === y) // false 

    // let y = x
    // console.log(x == y) // true
    // console.log(x === y) // true
    // y.a = 100
    // console.log(x.a) // 100

    // let y = Object.assign({}, x) // 浅克隆
    // y.a = 100
    // console.log(x.a) // 0

    // let x = {
    //   a: 0,
    //   b: 1,
    //   c: {
    //     ccc: 100
    //   }
    // }

    // let y = {
    //   a: 0,
    //   b: 1,
    //   c: {
    //     ccc: 200
    //   }
    // }
    // 假设ab共享内存，c不同  提高性能

    return (
      <div>
        immutable
      </div>
    )
  }
}
